<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>紫色鹭</title>
    <link rel="stylesheet" href="../css/common.css">
    <link rel="stylesheet" href="../css/swiper.min.css">
    <link rel="stylesheet" href="../css/style.css">
</head>
<body>
<div id="header_01_html">
    <iframe id="header_01" src="head_01.html" frameborder="0"></iframe>
</div>
<div id="head_search_html">
    <iframe id="head_search" src="head_search.html" frameborder="0"></iframe>
</div>
<div class="history container" v-cloak>
    <div class="box" v-for="item in list" v-cloak>
        <div class="describe_box">
            <div class="name">{{item.zslStore.name}}</div>
            <!--<div class="discrite">-->
                <!--<ul>-->
                    <!--<li>描述相符 <span class="c_red marl_5">5.0</span> <i class="icon_up_red"></i> 高于同行</li>-->
                    <!--<li>发货速度 <span class="c_red marl_5">5.0</span> <i class="icon_up_red"></i> 高于同行</li>-->
                    <!--<li>服务态度 <span class="c_red marl_5">5.0</span> <i class="icon_up_red"></i> 高于同行</li>-->
                <!--</ul>-->
            <!--</div>-->
            <div class="adress">
                <a target="_blank" class="qq-sty1" :href="'http://wpa.qq.com/msgrd?v=3&uin='+item.zslStore.qq+'&site=qq&menu=yes'">
                    <img src="../img/QQ.png" class="qq-box1" align="absmiddle">
                </a>
                <p>公司名称：{{item.zslStore.entName}}</p>
                <p>所在地址：{{item.zslStore.area}}</p>
                <p>联系电话：{{item.zslStore.phone}}</p>
            </div>
            <div class="button_box">
                <div @click="goStore(item.zslStore.id)">进入店铺</div>
                <div @click="collect(item.zslStore.id)" v-if="focus">关注店铺</div>
                <div @click="unCollect(item.zslStore.id)" v-else>已关注</div>


            </div>
        </div>
        <div class="right">
            <div class="title">本店热卖</div>
            <div class="swiper-container">
                <div class="swiper-wrapper">
                    <div class="swiper-slide" v-for="data in item.zslStoreCommodityList">
                        <div class="product_box" @click="goUrl(data.id)">
                            <img class="img" v-for="(it,index) in data.picUrl" v-if="index == 0" :src="imgBaseUrl + it" alt="">
                            <div class="name">{{data.name}}</div>
                            <div class="price">¥ {{data.price}}</div>
                        </div>
                    </div>

                </div>
                <!-- Add Arrows -->
                <div class="swiper-button-next"></div>
                <div class="swiper-button-prev"></div>
            </div>

        </div>
    </div>
</div>
<div class="tabRight">
    <div class="first">
        <ul>
            <li><a target="_blank"  class="icon_admin_white" title=""></a></li>
            <li>
                <a target="_blank"  class="go-shopcard">
                    <i class="icon_shopcar_white"></i>
                    <p class="mt10">购<br>物<br>车</p>
                    <span class="car-num pos-Sty1">0</span>
                </a>
            </li>
            <li>
                <a target="_blank" class="icon_list_white mt10 go-myorder" title="订单"></a>
                <a target="_blank" class="icon_collect_white mt10 go-myhas" title="收藏"></a>
                <a target="_blank" class="icon_history_white mt10 go-record" title="记录"></a>
            </li>
        </ul>
    </div>
    <div class="second">
        <a target="_blank"  class="icon_edit_white"></a>
        <a target="_blank"  class="icon_top_white mt10"></a>
    </div>
</div>
<script src="../js/config.js"></script>
<script src="../js/swiper.min.js"></script>
<script>

    var app = new Vue({
        el: '.history',
        data: {
            imgBaseUrl: imgBaseUrl,
            list:'',
            storename:'',
            focus:false,
            QQ:'',
        },
        beforeCreate: function () {
            var that = this;
            //获取我的收藏
            get_ajax("/sys/follow/getMyFollowPage", {limit: 12, offset: 1}, function (data) {
                data.forEach(function (items) {
                    items.zslStoreCommodityList.forEach(function (item) {
                        item.picUrl = item.picUrl.split(",");
                    })
                })
                that.list = data;
            });
        },
        updated: function () {
            var swiper = new Swiper('.swiper-container', {
                slidesPerView: 4,
                spaceBetween: 10,
                loop: true,
                navigation: {
                    nextEl: '.swiper-button-next',
                    prevEl: '.swiper-button-prev',
                },
            });
        },
        methods:{
            goUrl:function (e) {
                window.open('product_detail.html?productid='+e);
            },
            goStore:function (storeId) {
                window.open("store.html?storeid="+storeId)
            },
            collect:function (storeId) {
                get_ajax("/sys/follow/saveFollow", {storeId: storeId}, function (data) {
                    layer.msg("关注成功!");
                    app.focus = false;
                })
            },
            unCollect:function (storeId) {
                get_confirm("确认取消关注吗？",function () {
                    get_ajax("/sys/follow/delFollow", {id: storeId}, function (data) {
                        layer.msg("取消关注成功!");
                        app.focus = true;
                        get_ajax("/sys/follow/getMyFollowPage", {limit: 12, offset: 1}, function (data) {
                            data.forEach(function (items) {
                                items.zslStoreCommodityList.forEach(function (item) {
                                    item.picUrl = item.picUrl.split(",");
                                })
                            })
                            app.list = data;
                        });
                    })
                })
            },

        }
    })

    var name = localStorage.getItem('username');
    $('.icon_admin_white').attr('title',name);
</script>
</body>
</html>